import { IconHome } from "@arco-design/web-vue/es/icon";
import { ref, type Component } from "vue";

export interface MenuItem {
  title: string;
  name: string;
  icon?: string | Component;
  children?: MenuItem[];
  role?: number;
}

export const collapse = ref(false);
export const onCollapse = (val: boolean) => {
  val ? (collapse.value = true) : (collapse.value = false);
};

export const menuList = [
  {
    title: "首页",
    name: "Home",
    icon: IconHome,
    role: 1,
  },
  {
    title: "个人中心",
    name: "UserCenter",
    icon: IconHome,
    role: 1,
    children: [
      {
        title: "用户信息",
        name: "UserInfo",
        icon: "iconfont icon-yonghuxinxi",
      },
    ],
  },
  {
    title: "用户管理",
    name: "UserManage",
    icon: IconHome,
    children: [
      {
        title: "用户列表",
        name: "UserList",
        icon: "iconfont icon-pingtaiiconhuizong_huaban1fuben4",
      },
    ],
  },
  {
    title: "组件管理",
    name: "ComponentManage",
    icon: IconHome,
    children: [
      {
        title: "组件列表",
        name: "ComponentList",
        icon: "iconfont icon-zujianliebiao-",
      },
    ],
  },
  {
    title: "系统管理",
    name: "SettingsManage",
    icon: IconHome,
    children: [
      {
        title: "系统信息",
        name: "SettingsInfo",
        icon: "iconfont icon-xitongxinxi",
      },
    ],
  },
];
